<template>
  <div class="wDHis-wrapper">
    <div @click="leftBtn" class="arrow-left">
      <img src="../../images/jiantou.png" alt="">
    </div>
    <div class="wDHis-hd">
      <span class="wDhis-total-title">红包余额</span>
      <span class="wDhis-total"><span class="wDhis-total-money">{{cumulativeWithdraw}}</span></span>
    </div>
    <div class="wDHis-bd">
      <div class="wDHis-item" v-for="(item,index) in dataList" :key="index">
        <div class="wDHis-item-info">
          <span class="wDhis-info-title">{{item.remark}}</span>
          <span class="wDhis-info-time">{{item.gmtCreated}}</span>
        </div>
        <span class="wDHis-item-count">{{item.point}}红包</span>
      </div>
      <div
          v-if="!dataList.length"
          class="no-data"
      >
        当前明细列表为空~
      </div>
    </div>
  </div>
</template>
<script>
import CONSTANT from "../../../wechat/static/constant/urlconstant";
import common from "../../../wechat/static/common/common";

export default {
  data(){
    return{
      dataList:[],
      cumulativeWithdraw:0
    }
  },
  mounted(){
    this.getList()
    this.getUserPoints()
  },
  methods:{
    leftBtn(){
      this.$router.back(-1)
    },
    getUserPoints() {
      let url = CONSTANT.LIST.findUserBalance;
      common.get(url, "", res => {
        if (res.code == 200) {
          this.cumulativeWithdraw = res.data.bussData;
        }
      });
    },
    getList() {
      let url = CONSTANT.MY.userPage;
      common.post(url,{
        pageIndex: 1,
	      pageSize: 10000
      }, res => {
        if (res.code == 200) {
          this.dataList = res.data.bussData;
        }
      });
    },

  }
  
}
</script>
<style lang="less">
  .wDHis-wrapper{
    width:100%;
    height:100%;
    background-color: #fafafa;
    .arrow-left{
        position: absolute;
        left: .3rem;
        top: .15rem;
        height: .9rem;
        width: 1rem;
        z-index: 99;
        img{
          height: .5rem;
          width: .5rem;
        }
      }
    .wDHis-hd{
      height:2.7rem;
      background:linear-gradient(-90deg,rgba(255,151,86,1),rgba(255,94,114,1));
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: flex-start;
      color:#fff;
      .wDhis-total-title{
        font-size: .24rem;
        font-family:PingFang-SC-Regular;
        margin-top:.6rem;
      }
      .wDhis-total{
        font-size: .28rem;
        font-weight: 400;
        .wDhis-total-money{
          font-size: .52rem;
          font-weight: bold;

        }
      }
    }
    .wDHis-bd{
      margin-top:.2rem;
      .wDHis-item{
        padding:.3rem;
        background: white;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        .wDHis-item-info{
          display: flex;
          flex-direction: column;
          justify-content: space-between;
          .wDhis-info-title{
            font-size:.3rem;
            font-family:PingFang-SC-Medium;
            font-weight:500;
            color:rgba(51,51,51,1);
            width: 5rem;
          }
          .wDhis-info-time{
            margin-top:.2rem;
            font-size:.26rem;
            font-family:PingFang-SC-Medium;
            font-weight:500;
            color:rgba(153,153,153,1);
          }
        }
        .wDHis-item-count{
          font-size:.34rem;
          font-family:PingFang-SC-Bold;
          font-weight:bold;
          color:#FF7268;
        }
      }
    }
  }
</style>
